<template>
    <div class="myconsult">
      <tab-List :catelist="navList" :selectid="TabCur" :index01="index01" v-on:tabselect="tabselect" />

      <div class="myconList">
        <div class="myconItem" v-for="my of mylist" :key="my.id" @click="todetail(my.id)" >
          <div class="myconTime flex row justify-between">
            <span class="time">{{my.addtime}}</span>
            <span class="state">关闭</span>
          </div>
          <div class="myconcent">
           {{my.content}}
          </div>
          <div class="myconAuthor flex row justify-between">
            <div class="Author flex row align-center" >
              <img src="../../assets/images/userimg.png" />
              <span>{{my.CateName}}</span>
            </div>
            <span class="navName">来源：{{my.from_data}}</span>
          </div>
        </div>
      </div>
      <div class="foot">
        <tabbarNav :tabbarindex="tabbarindex" />
      </div>
    </div>
</template>

<script>
import { getNavList, getmycousult } from '@/api/consult'
import tabList from './components/navList'
import tabbarNav from '@/components/nav'
export default {
  name: 'myconsulting',
  components: { tabList, tabbarNav },
  data () {
    return {
      tabbarindex: 2,
      navList: [],
      TabCur: '',
      index01: 0,
      mylist: []
    }
  },
  created () {
    console.log(this.$route.params)
    if (this.$route.params.id) {
      this.TabCur = this.$route.params.id
      this.index01 = this.$route.params.index
    }
    getNavList().then(res => {
      this.navList = res.data
      console.log(this.index01)
      this.TabCur = this.TabCur ? this.TabCur : res.data[0].id
      this.getmycount(this.index01)
    })
  },
  methods: {
    tabselect (val) {
      console.log(val)
      this.index01 = val
      this.TabCur = this.navList[val].id
      this.getmycount(this.index01)
    },
    getmycount (e) {
      getmycousult(this.navList[e].id).then(res => {
        this.mylist = res.data
      })
    },
    todetail (e) {
      this.$router.push({name: 'consultDetail', params: {id: e}})
    }
  }
}
</script>

<style scoped>
  .myconTime{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: .24rem;
    color: #999;
    margin-bottom: .1rem;
  }
  .myconList{

  }
  .myconItem{
    padding: .3rem;
  }
  .myconcent{
    color: #101010;
    font-size: .28rem;
    margin-top: .1rem;
  }
  .myconItem image{
    width: .6rem;
    height: .6rem;
    border-radius: 50%;
    border:1px solid #999;
    margin-right: .2rem;
    background: #efefef;
  }
  .myconAuthor{
    color: #999;
    margin-top: .14rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }
  .Author img{
    width: 1rem;
    height: 1rem;
  }
</style>
